<template>
	<div class="query">
		<div class="check">
			<div class="c_left">条件搜索栏</div>
			<div class="c_right" :style="style">
				<div class="clear">
					<div class="fl">
						<span class="c_tip">门诊号</span>
						<input type="text" class="c_input" v-model="mz_jz_zyh" placeholder="请输入门诊号">
					</div>
					<div class="fl">
						<span class="c_tip">病人号</span>
						<input type="text" class="c_input" v-model="patientId" placeholder="请输入病人号">
					</div>
					<div class="fl">
						<span class="c_tip">病人姓名</span>
						<input type="text" class="c_input" v-model="patientName" placeholder="请输入病人姓名">
					</div>
					<div class="fl">
						<span class="c_tip">科室</span>
						<input type="text" class="c_input c_search" v-model="zd_dept_names" placeholder="请输入科室" readonly="readonly">
						<input type="hidden" class="c_input" v-model="zd_dept_codes">
						<i class="c_searchbtn" @click="selectPop('科室')">选择</i>
					</div>
					<div class="fl">
						<span class="c_tip">药品</span>
						<input type="text" class="c_input c_search" v-model="zd_drug_names" placeholder="请输入药品" readonly="readonly">
						<input type="hidden" class="c_input c_search" v-model="zd_drug_codes">
						<i class="c_searchbtn"  @click="selectPop('药品')">选择</i>
					</div>
					<div class="fl">
						<span class="c_tip">医生</span>
						<input type="text" class="c_input c_search" v-model="zd_doc_names" placeholder="请输入医生" readonly="readonly">
						<input type="hidden" class="c_input c_search" v-model="zd_doc_codes">
						<i class="c_searchbtn" @click="selectPop('医生')">选择</i>
					</div>
					<div class="fl">
						<span class="c_tip">药师</span>
						<input type="text" class="c_input c_search" v-model="zd_phr_names" placeholder="请输入药师" readonly="readonly">
						<input type="hidden" class="c_input c_search" v-model="zd_phr_codes">
						<i class="c_searchbtn"  @click="selectPop('药师')">选择</i>
					</div>
					<div class="fl">
						<span class="c_tip">处方状态</span>
						<el-select v-model="phar_state" collapse-tags multiple placeholder="请选择" class="c_select">
						    <el-option
						      v-for="item in prescriptionStatus"
						      :key="item.value"
						      :label="item.label"
						      :value="item.value">
						    </el-option>
						  </el-select>
					</div>
					<div class="fl">
						<span class="c_tip">开始时间</span>
						<el-date-picker
							v-model="startTime"
							type="date"
							placeholder="选择日期"
							class="c_select">
						</el-date-picker>
					</div>
					<div class="fl">
						<span class="c_tip">结束时间</span>
						<el-date-picker
							v-model="endTime"
							type="date"
							placeholder="选择日期"
							class="c_select">
						</el-date-picker>
					</div>
					<div class="fl" style="width:325px;">
						<span class="c_tip">警示级别</span>
						<el-checkbox-group v-model="slCode" class="c_checkbox">
						    <el-checkbox label="1">禁忌</el-checkbox>
						    <el-checkbox label="2">不推荐</el-checkbox>
						    <el-checkbox label="3">轻微</el-checkbox>
						  </el-checkbox-group>
					</div>
				</div>
				<div class="sbtn_box">
					<el-button type="danger" class="btn_clear" @click="clearFun">清空</el-button>
					<el-button type="primary" class="btn_clear" @click="searchFun" style="margin-left:7px;">查询</el-button>
				</div>
				<div class="show_btn" @click="showMore" v-if="!sbtnFlag">
					<i class="el-icon-caret-bottom"></i>
					<span>显示更多</span>
				</div>
				<div class="show_btn" @click="showHide" v-if="sbtnFlag">
					<i class="el-icon-caret-top"></i>
					<span>收起</span>
				</div>
			</div>
		</div>
		<div class="list_tip clear">
			<!-- <span class="fl">数据管理列表</span> -->
		</div>
		<div class="table_box">
			<Ptctable :search.async="search" @changeSeekPop="changeSeekPop"></Ptctable>
		</div>
		<Poptable :pType="pType" ctype="mz" ref="ptable" @dept="deptChange" @drug="drugChange" @doc="docChange" @phr="phrChange"></Poptable>
		<Queryseekpop :seekRow="seekRow" ref="qPop" type="mz" @clickFun="clickFun"></Queryseekpop>
		<HistoryVersion :vRow="vRow" ref="qvPop"></HistoryVersion>
	</div>
</template>

<script>
	import Ptctable from "../components/ptctable"
	import Poptable from "../components/poptable"
	import Queryseekpop from "../components/querySeekPop"
	import HistoryVersion from "../components/historyVersion"
	export default {
		components:{Ptctable,Poptable,Queryseekpop,HistoryVersion},
		data () {
			return {
				mz_jz_zyh:"",
				patientId:"",
				patientName:"",
				zd_dept_codes:"",
				zd_dept_names:"",
				zd_drug_codes:"",
				zd_drug_names:"", 
				zd_doc_codes:"",
				zd_doc_names:"",
				zd_phr_codes:"",
				zd_phr_names:"",
				slCode:[],
				phar_state:[],
				startTime:"",
				endTime: "",
				search:{
					mz_jz_zyh:"",
					patientId:"",
					patientName:"",
					zd_dept_codes:"",
					zd_dept_names:"",
					zd_drug_codes:"",
					zd_drug_names:"", 
					zd_doc_codes:"",
					zd_doc_names:"",
					zd_phr_codes:"",
					zd_phr_names:"",
					slCode:[],
					phar_state:[],
					startTime:"",
					endTime: "",
				},
				checkList:[],
				prescriptionStatus: [],
				value: '',
				value1:"",
				dialogDrugs:false,
				dialogDoctor:false,
				dialogPerson:false,
				multipleSelection: [],
				input:"",
				pType:"11",
				sbtnFlag:false,
				style:"height: 60px;padding-top: 10px;",
				seekRow:{},
				vRow:{}
			}
		},
		mounted() {
			this.prescriptionStatus=this.$utils.prescriptionStatus();
		},
		methods:{
			changeSeekPop (row) {
				this.seekRow = row;
				this.$refs.qPop.show();
			},
			deptChange(data){
				var names=[],codes=[];
				for(var i=0;i<data.length;i++){
					names.push(data[i].ksmc)
					codes.push(data[i].ksdm)
				}
				this.zd_dept_names=names.join(",");
				this.zd_dept_codes=codes.join(",");
			},
			drugChange(data){
				var names=[],codes=[];
				for(var i=0;i<data.length;i++){
					names.push(data[i].ypmc)
					codes.push(data[i].ypdm)
				}
				this.zd_drug_names=names.join(",");
				this.zd_drug_codes=codes.join(",");
			},
			docChange(data){
				var names=[],codes=[];
				for(var i=0;i<data.length;i++){
					names.push(data[i].ysmc)
					codes.push(data[i].ysdm)
				}
				this.zd_doc_names=names.join(",");
				this.zd_doc_codes=codes.join(",");
			},
			phrChange(data){
				var names=[],codes=[];
				for(var i=0;i<data.length;i++){
					names.push(data[i].real_name)
					codes.push(data[i].user_name)
				}
				this.zd_phr_names=names.join(",");
				this.zd_phr_codes=codes.join(",");
			},
			selectPop (val) {
				this.$refs.ptable.show();
				this.pType = val;
			},
			showMore(){
				this.sbtnFlag = true;
				this.style = "";
			},
			showHide(){
				this.sbtnFlag = false;
				this.style = "height: 60px;padding-top: 10px;";
			},
			clearFun(){
				this.search={
					mz_jz_zyh:"",
					patientId:"",
					patientName:"",
					zd_dept_codes:"",
					zd_dept_names:"",
					zd_drug_codes:"",
					zd_drug_names:"", 
					zd_doc_codes:"",
					zd_doc_names:"",
					zd_phr_codes:"",
					zd_phr_names:"",
					slCode:"",
					phar_state:[],
					startTime:"",
					endTime: "",
				};
				this.mz_jz_zyh="";
				this.patientId="";
				this.patientName="";
				this.zd_dept_codes="";
				this.zd_dept_names="";
				this.zd_drug_codes="";
				this.zd_drug_names=""; 
				this.zd_doc_codes="";
				this.zd_doc_names="";
				this.zd_phr_codes="";
				this.zd_phr_names="";
				this.slCode=[];
				this.phar_state=[];
				this.startTime="";
				this.endTime="";
			},
			searchFun(){
				this.search={
					mz_jz_zyh:this.mz_jz_zyh,
					patientId:this.patientId,
					patientName:this.patientName,
					zd_dept_codes:this.zd_dept_codes,
					zd_dept_names:this.zd_dept_names,
					zd_drug_codes:this.zd_drug_codes,
					zd_drug_names:this.zd_dept_names, 
					zd_doc_codes:this.zd_doc_codes,
					zd_doc_names:this.zd_dept_names,
					zd_phr_codes:this.zd_phr_codes,
					zd_phr_names:this.zd_dept_names,
					slCode:(this.slCode).join(","),
					phar_state:(this.phar_state).join(","),
					startTime:this.startTime,
					endTime: this.endTime,
				}
			},
			clickFun(row){
				this.vRow = row;
				this.$refs.qvPop.show();
			}
		}
	}
</script>

<style lang="scss" scoped="scoped">
	body{
		background:#e6edf5;
	}
	.query{
		width:100%;
		height:100%;
		background:#e6edf5;
		.check{
			font-size:12px;
			line-height:40px;
			background:#fff;
			text-align:center;
			.c_left{
				width:115px;
				float:left;
				line-height:65px;
			}
			.c_right{
				overflow:hidden;
				color:#636365;
				border-left:1px solid #e6edf5;
				padding:15px 0;
				position:relative;
				.show_btn{
					position:absolute;
					right:20px;
					bottom:15px;
					border:1px solid #e1e1e1;
					background:#f9fafc;
					border-radius:2px;
					text-align:center;
					line-height:32px;
					width:104px;
					height:32px;
					font-size:14px;
					color:#9f9f9f;
					cursor: pointer;
				}
				.fl{
					margin-bottom:10px;
				}
				.c_tip{
					display:inline-block;
					width:80px;
					padding-right:10px;
					text-align:right;
				}
				.c_input{
					width:145px;
					height:40px;
					border:1px solid #dcdfe6;
					border-radius:4px;
					padding-left:5px;
				}
				.c_input::-webkit-input-placeholder {
					color: #dcdfe6;
				}
				.c_input::-ms-input-placeholder {
					color: #dcdfe6;
				}
				.c_input::-moz-input-placeholder {
					color: #dcdfe6;
				}
				.c_search{
					width:105px;
				}
				.c_searchbtn{
					display:inline-block;
					width:34px;
					height:25px;
					margin-left:3px;
					background:#28a4f4;
					color:#fff;
					font-size:12px;
					text-align:center;
					line-height:26px;
					border-radius:6px;
					cursor:pointer;
				}
				.c_checkbox{
					width:230px;
					height:40px;
					display:inline-block;
					margin-left:-12px;
				}
				.btn_clear{
					padding:0;
					width:60px;
					height:40px;
					line-height:40px;
				}
				.sbtn_box{
					text-align:left;
					padding-left:82px;
				}
				.c_select{
					width:145px;
				}
				@media screen and (min-width:1466px){
					.c_select{
						width:150px;
					}
					.btn_clear{
						padding:0;
						width:70px;
						height:40px;
						line-height:40px;
					}
					.c_input{
						width:150px;
					}
					.c_search{
						width:100px;
					}
					.c_searchbtn{
						width:42px;
						margin-left:4px;
					}
					.c_tip{
						width:100px;
					}
				}
			}
		}
		.list_tip{
			font-size:14px;
			color:#29a4f2;
			padding:10px 18px;
		}
		.table_box{
			padding:0 18px;
		}
	}
	.el-checkbox__label{
		padding-left:5px;
	}
	.el-checkbox{
		margin-right:10px;
	}
</style>
